import React, {useEffect, useState} from 'react';
import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons';
import {Layout, Row, Col, notification} from 'antd';
import moment from 'moment'
import BasicRouter from '../route/BasicRouter';
import Menu from "./component/Menu";
import User from "./component/User";
import BreadcrumbNavigation from "./component/BreadcrumbNavigation";
import Cache from "../utils/Cache";
import PubSub from "pubsub-js";
import {SubEvent} from "../server/enum";
import './index.less'

const { Header, Sider, Content } = Layout;

const BasicLayout = () => {

	useEffect(() => {
		document.oncontextmenu = function () {
			return true;
		}

		return () => {}
	}, [])



	return (
		<Layout>
			<Sider trigger={null} style={{height: '100vh', overflowY: 'auto', backgroundColor: '#001529'}}>
				<Row type={'flex'} justify={'center'} align={'middle'} style={{height: '64px', color: 'white', fontSize: '22px'}}>
					宜昌清廉乡村
				</Row>
				<Menu />
			</Sider>
			<Layout className="site-layout">
				<Header style={{padding: '0 10px', backgroundColor: '#001529'}}>
					<Row type={'flex'} justify={'space-between'} align={'middle'} style={{height: '100%'}}>
						<Col>
							<Row type={'flex'} justify={'space-between'}>

							</Row>
						</Col>
						<Col><User /></Col>
					</Row>
				</Header>
				<Content style={{margin: '0 26px'}}>
					<Row type={'flex'} align={'middle'} style={{height: '50px'}}>
						<BreadcrumbNavigation />
					</Row>
					<div style={{ height: "calc(100vh - 145px)", padding: '12px 25px', background: 'white' }}>
						<BasicRouter />
					</div>
				</Content>
			</Layout>
		</Layout>
	);
};
export default BasicLayout;
